{% extends 'base.html' %}

{% block css %}
<link href="/static/css/signin.css" rel="stylesheet">
<script src="http://cdn.bootcss.com/jquery/1.8.3/jquery.min.js"></script>
{% endblock %}

{% block js %}
<script>
function click_p_1(county_id) {
    $('#positions').html('')
    $.post('/position/get_town_list', {'county_id': county_id}, function (data) {
        for(i=0; i<data.town_list.length; i++){
            $('#positions').append("<label onclick='click_p_2(" + data.town_list[i].town_id + ")'>" + data.town_list[i].name + "</button>")
        }
    })
    $("[name='county_id']").val(county_id);
}

function click_p_2(town_id) {
    $('#positions').html('')
    $.post('/position/get_village_list', {'town_id': town_id}, function (data) {
        for(i=0; i<data.village_list.length; i++){
            $('#positions').append("<label onclick='click_p_3("+ data.village_list[i].village_id +")'>" + data.village_list[i].name + "</button>")
        }
    })
    $("[name='town_id']").val(town_id);
}

function click_p_3(village_id) {
    $("[name='village_id']").val(village_id);
}
</script>
{% endblock %}

{% block content %}
  <form class="form-signin" role="form" method="post" enctype="multipart/form-data">
    <input name="county_id" hidden>
    <input name="town_id" hidden>
    <input name="village_id" hidden>

    <input type="file" class="form-control" placeholder="头像"  name="avatar">
    <input type="text" class="form-control" placeholder="真实姓名(仅同村人可见)"  name="true_name">
    <input type="text" class="form-control" placeholder="个性签名"  name="declaration">
    <br>

    <div id="positions">
        {% for c in county_list %}
            <label onclick="click_p_1({{ c.county_id }})">{{ c.county_name }}</label>
        {% endfor %}
    </div>
    <button class="btn btn-lg btn-primary btn-block" type="submit">提交</button>
  </form>
{% endblock %}
